;
(function(doc, tpl, tools) {
    function MyTab(el) {
        this.el = doc.querySelector(el);
        console.log(this.el);
        this.data = JSON.parse(this.el.getAttribute('data'));
        console.log(this.data);
        this.init();
    }

    MyTab.prototype.init = function() {
        this._render();
        this._bindEvent();
    }

    MyTab.prototype._render = function() {
        var tabWrapper = doc.createElement('div');
        var pageWrapper = doc.createElement('div');
        var oFrag = doc.createDocumentFragment();
        this.data.forEach(function(item, index) {
            //在tpl模板js文件中使用switch选择，因为是个函数所以要调用，然后返回对应的模板
            tabWrapper.innerHTML += tools.tplReplace(tpl.tab('tab'), {
                tab: item.tab,
                current: !index ? 'current' : ''
            })
            pageWrapper.innerHTML += tools.tplReplace(tpl.page('page'), {
                page: item.page,
                current: !index ? 'current' : ''
            })

        })
    }

    MyTab.prototype._bindEvent = function() {

    }

    window.MyTab = MyTab;
})(document, tpl, tools);